<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://shiro.apache.org/tags" prefix="s"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>${webName}-后台管理系统</title>
    <link rel="stylesheet" href="${res}/layui/css/layui.css">
    <link rel="stylesheet" href="${res}/plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="${res}/story/css/admin.css">
</head>

<div id="warning" style="display:none;">
	<c:choose>
		<c:when test="${loginInfoMap!=null}">
			欢迎您：${loginInfoMap.loginName}  <br>
			您上次登录的时间为：${loginInfoMap.lastLoginTime}<br>
			您上次登录的IP为:${loginInfoMap.loginIp}
		</c:when>
		<c:otherwise>
			您第一次登录哟
		</c:otherwise>
	</c:choose>
</div>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
  <div class="layui-header" style="background:#0066CC;">
    <div class="layui-logo" style="font-size:22px;font-weight:bold;background-color:#003D79;color:#FFFFFF;">小故事后台管理</div>
    <!-- 头部区域（可配合layui已有的水平导航） -->
    <ul class="layui-nav layui-layout-left" style="background:#0066CC;">
      <li class="layui-nav-item"><a href="">控制台</a></li>
      <li class="layui-nav-item"><a href="">商品管理</a></li>
      <li class="layui-nav-item"><a href="">用户</a></li>
      <li class="layui-nav-item">
        <a href="javascript:;">其它系统</a>
        <dl class="layui-nav-child">
          <dd><a href="">邮件管理</a></dd>
          <dd><a href="">消息管理</a></dd>
          <dd><a href="">授权管理</a></dd>
        </dl>
      </li>
    </ul>
    <ul class="layui-nav layui-layout-right">
      <li class="layui-nav-item">
        <a href="javascript:;">
          <img src="http://t.cn/RCzsdCq" class="layui-nav-img">
          <s:principal/>
        </a>
        <dl class="layui-nav-child">
          <dd><a href="">基本资料</a></dd>
          <dd><a href="">安全设置</a></dd>
        </dl>
      </li>
      <li class="layui-nav-item"><a id="logout" href="javascript:;">注销退出</a></li>
    </ul>
  </div>
  
  <div class="layui-side" style="background-color:#2F4056;">
    <div class="layui-side-scroll">
      <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
      <ul class="layui-nav layui-nav-tree"  style="background-color:#2F4056;">
      	<li class="layui-nav-item">         
          <a class="navlink" href="javascript:;" nav-icon="&#xe68e;" nav-id="1" nav-title="后台首页" nav-url="http://www.baidu.com"> &nbsp;<i class="layui-icon">&#xe68e;  </i> 后台首页</a>
        </li>
        <li class="layui-nav-item">         
          <a href="javascript:;"><i class="layui-icon">&#xe613;</i>&nbsp;用户管理</a>
          <dl class="layui-nav-child">
            <dd><a class="navlink" href="javascript:;" nav-icon="&#xe612;" nav-id="2" nav-title="管理员管理" nav-url="${base}/manager/admin/list"><i class="layui-icon">&#xe612;</i>&nbsp;管理员管理</a></dd>
            <dd><a class="navlink" href="javascript:;" nav-icon="&#xe612;" nav-id="3" nav-title="注册会员管理" nav-url="${base}/manager/member/list"><i class="layui-icon">&#xe612;</i>&nbsp;注册会员管理</a></dd> 
            <dd><a class="navlink" href="javascript:;" nav-icon="&#xe612;" nav-id="4" nav-title="在线用户管理" nav-url="${base}/manager/online/list"><i class="layui-icon">&#xe612;</i>&nbsp;在线用户管理</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item">
          <a href="javascript:;">权限管理</a>
          <dl class="layui-nav-child">
            <dd><a href="javascript:;">列表一</a></dd>
             <dd><a class="navlink" href="javascript:;" nav-icon="&#xe612;" nav-id="4" nav-title="在线用户管理" nav-url="${base}/user/getOnlineUsersWithLimit"><i class="layui-icon">&#xe612;</i>&nbsp;在线用户测试</a></dd>
            <dd><a class="navlink" href="javascript:;" nav-icon="&#xe612;" nav-id="4" nav-title="在线用户管理" nav-url="${base}/online/getOnlineWithLimit"><i class="layui-icon">&#xe612;</i>&nbsp;在线用户管理</a></dd>
          </dl>
        </li>
      </ul>
    </div>
  </div>
  
  <div class="layui-body" style="bottom:0px;">
    <!-- 内容主体区域 -->
      <div class="layui-tab layui-tab-brief" lay-filter="mainTab" lay-allowClose="true" style="margin:0;padding:0;">
		  <ul class="layui-tab-title">
		    
		    <li lay-id="1" class="layui-this" ><i class="layui-icon" style="display:inline-block;">&#xe68e;</i>&nbsp;后台首页</li>
		  </ul>
	  <div class="layui-tab-content" style="padding:0px;">
	    <div class="layui-tab-item layui-show">
	    	<div class="layui-tab-index"></div>
	    </div>	 
	  </div>
     </div>
  </div>
</div>


<script src="${res}/layui/layui.js"></script>
<script>
//JavaScript代码区域
layui.use(['element','layer','form'], function(){ 	
  var element = layui.element,
  $ = layui.$,
  layer = layui.layer,
  form =layui.form;
  layer.config({
	  skin: 'story-layer'
	})
  var _this = this;
  var windowHeight = $(window).height()-105;
  $('.layui-tab-index').height(windowHeight);
  
  layer.open({
	  type:1,
	  title:false,
	  content: $('#warning'),
	  area: ['300px', '200px'],
	  closeBtn: 0,
	  time: 5000,
	  shade: 0,
	  offset:'rb',
	  anim: 2,
	  isOutAnim: false
  });
  
  //动态调整iframe
   
   $(window).on('resize', function() {
		var $content = $('.layui-tab-content');
		$content.height($(this).height() - 104);
		$content.find('iframe').each(function() {
			$(this).height($content.height());
		});
	}).resize();
  $(document).ajaxComplete(
	  function(event, xhr, settings){
		  var sessionStatus = xhr.getResponseHeader("sessionStatus");
		  if(sessionStatus == "401"){
			  layer.alert('登录时间过长，请重新登录再操作！',{icon:5},function(index){
				  layer.close(index);
				  window.location.href='${base}/admin/login'
			  });
		  }
	  }
  );
 
  
  //动态添加tab
  $('.navlink').on('click',function(){
	  var layerIndex = layer.load(1);
	  var url = $(this).attr('nav-url');
	  var icon = $(this).attr('nav-icon');
	  var id = $(this).attr('nav-id');
	  var navTitle = $(this).attr('nav-title');
	  var index = tabidExited(id);
	  if(index===-1){
		  var tabid = id ? id : new Date().getTime();
			  var content = '<iframe frameborder="0" scrolling="no" width="100%" height="'+windowHeight+'" src="'+url+'" data-id="'+id+'" style="margin:0px;padding:0px;"></iframe>';
		 	  var title = '';
		 	  if(icon){
		 		  title = '<i class="layui-icon">'+icon+'</i>&nbsp;'+navTitle;
		 	  }
		 	  element.tabAdd('mainTab',{
		 		  title:title,
		 		  content:content,
		 		  id:tabid
		 	  });
		 	  element.tabChange('mainTab',tabid);
		 	  element.init();	  		 
	  }else{
		  element.tabChange('mainTab',id);
	  }
	  layer.close(layerIndex);
  });
  
  tabidExited = function (tabid){
	  var index = -1;
	  $('ul.layui-tab-title').find('li').each(function(i,e){		  
		  if($(this).attr('lay-id')===tabid){
			  index = $(this).attr('lay-id');
		  }		  
	  });
	  return index;
  }
  
  //注销退出
  $('#logout').on('click',function(){
	  layer.confirm('确定要退出吗？',{icon:3,title:'提示'},function(index){
		  layer.close(index);
		  window.location.href='${base}/manager/logout'
	  });
  });
});
</script>
</body>
</html>